// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
// See the LICENCE file in the repository root for full licence text.

.page-contents {
  width: 100%;
  font-size: 14px;

  display: flex;
  flex: 1 0 auto;
  flex-direction: column;

  @media @desktop {
    flex-direction: row;
  }

  &--artist {
    flex-direction: column-reverse;
    background-color: @osu-colour-b5;
    @media @desktop {
      flex-direction: row;
      background: none;
    }
  }

  &__artist-left {
    flex: 1;
  }

  &__content {
    padding: 20px 20px 10px;

    @media @desktop {
      flex-basis: (100% / 3);
      max-width: (100% / 3);

      & + & {
        border-width: 0 0 0 1px;
        border-style: solid;
        border-image: linear-gradient(to top, #ccc, transparent 80%) 1;
      }
    }
  }

  &__row {
    margin-bottom: 10px;
    padding: 0 10px;

    &--top {
      margin-bottom: 20px;
    }
  }

  &__sidebar {
    @media @desktop {
      height: 100%;
      margin-left: 10px;
    }
  }
}
